<template>
  <div>
    <el-dialog
      top="80px"
      width="70%"
      title="我的公示"
      :visible.sync="visible"
      :before-close="hanldClose"
      :close-on-click-modal="false"
    >
      <c-table
        border
        class="table-sm"
        v-loading="loading"
        :stripe="false"
        :columns="tableColumns"
        :data="tableData"
      >
        <template slot="operations" slot-scope="scope">
          <el-button
            type="text"
            class="py-0 px-2"
            title="打印"
            @click="printDetail(scope.row.public_id)"
          >
            <i class="fa fa-print"></i>
          </el-button>
          <el-button
            type="text"
            class="py-0 px-2"
            title="上传附件"
            @click="uploadAttach(scope.row.public_id, scope.row.attachment)"
          >
            <i class="fa fa-cloud-upload"></i>
          </el-button>
          <el-button
            type="text"
            class="py-0 px-2"
            title="查看附件"
            @click="showAttach(scope.row.attachment)"
          >
            <i class="fa fa-picture-o"></i>
          </el-button>
          <!-- <el-button class="py-0 px-2"
                     type="primary"
                     @click="handleView(scope.row)">查看档案</el-button> -->
        </template>
      </c-table>

      <el-pagination
        layout="total, prev, pager, next, jumper"
        :current-page.sync="params.index"
        :page-size="params.size"
        :total="tableCount"
        @current-change="getData"
      ></el-pagination>

      <div class="visit-fuj" style="text-align: center">
        <el-button @click="hanldClose">返回</el-button>
      </div>
    </el-dialog>

    <el-dialog
      top="80px"
      width="70%"
      append-to-body
      title="附件"
      :visible.sync="uploadVisible"
      :before-close="CloseUpload"
      :close-on-click-modal="false"
    >
      <upload-oss
        multiple
        accept="image/*"
        listType="picture-card"
        ref="upload_oss"
        :file-list="fileList"
        :on-complete="handleImagesComplete"
      ></upload-oss>
      <el-button type="primary" style="margin: 1rem" @click="upListData">上传</el-button>
    </el-dialog>

    <el-dialog
      top="80px"
      width="70%"
      append-to-body
      title="附件"
      :visible.sync="attachVisible"
      :before-close="CloseAttach"
      :close-on-click-modal="false"
    >
      <attach-list :data-list="dataList"></attach-list>
    </el-dialog>
    <publicity-print
      :visible.sync="detailVisible"
      :myPublicity="true"
      :data-list="selects"
      printId="mypublicity-print"
    ></publicity-print>
  </div>
</template>

<script>
// const visdate = new Date().toLocaleDateString()
import AttachList from '@/credit/views/city/task/AttachList'
import PublicityPrint from '@/gov/views/business/PublicityPrint'
export default {
  components: {
    AttachList,
    PublicityPrint,
  },
  props: {
    visible: Boolean,
  },
  data() {
    return {
      dataList: [],
      selects: [],
      params: {
        index: 1,
        size: 15,
      },
      attachVisible: false,
      detailVisible: false,
      uploadVisible: false,
      tableName: 'datum_customer_public_detail_view',
      rowId: '',
      loading: false,
      tableData: [],
      tableCount: 0,
      fileList: [],
      tableColumns: [
        {
          attrs: { label: '公示时间', prop: 'public_date', align: 'center' },
          process: v => this.$utils.dateFormat(v, 'yyyy-MM-dd'),
        },
        { attrs: { label: '所属地区', prop: 'address', align: 'center' } },
        { attrs: { label: '操作人员', prop: 'submit_person_name', align: 'center' } },
        { attrs: { label: '项目数量', prop: 'public_total', align: 'center' } },
        { attrs: { label: '贷款金额', prop: 'funds_total', align: 'center' } },
        {
          attrs: { label: '附件状态', prop: 'attachment', align: 'center' },
          process: v => (v ? '已上传' : '未上传'),
        },
        { attrs: { label: '操作', align: 'center', minWidth: '100px' }, slot: 'operations' },
      ],
    }
  },
  watch: {
    visible(value) {
      if (value) {
        this.getData()
      }
    },
  },
  created() {},
  computed: {
    user() {
      return this.$store.getters.user
    },
  },
  methods: {
    async handleImagesComplete(images) {
      if (!images.length) {
        return this.$message.warning('没有要上传的图片！')
      }

      const attach = images.length ? `["${images.map(item => item.url).join(',')}"]` : ''
      let data = {
        attachment: attach,
      }
      const [res] = await this.$utils.promise(
        this.$api.updateData('credit', 'datum_customer_public', this.rowId, data)
      )
      if (res) {
        this.$message.success('添加附件成功！')
        this.getData()
        this.CloseUpload()
      } else {
        this.$message.error('添加附件失败，请重试！')
      }
    },
    upListData() {
      this.$refs.upload_oss.submit()
    },
    uploadAttach(id, attach) {
      this.rowId = id
      this.uploadVisible = true
      if (attach) {
        let data = attach.replace(/^\["(\S+)"\]$/, '$1').split(',')
        this.fileList = data.map(item => {
          return { url: item }
        })
      }
    },
    CloseUpload() {
      this.fileList = []
      this.uploadVisible = false
    },
    async printDetail(id) {
      let data = {}
      data['public_id.eq'] = id
      const [res] = await this.$utils.promise(this.$api.getData('credit', this.tableName, data))
      if (res) {
        this.selects = res.data
        this.detailVisible = true
        return
      }
      this.$message.error('操作失败，请重试！')
    },
    showAttach(attach) {
      if (attach) {
        let array = attach.replace(/^\["(\S+)"\]$/, '$1').split(',')
        this.dataList = array.map(item => {
          return { src: item }
        })
      }
      this.attachVisible = true
    },
    getData() {
      this.loading = true
      this.params['submit_person.eq'] = this.user.userId
      this.$api
        .getData('credit', 'datum_customer_public_view', this.params, { public_date: 'desc' })
        .then(res => {
          if (res && res.data) {
            this.tableData = res.data.data
            this.tableCount = res.data.totalCount
          }
        })
        .finally(() => {
          this.loading = false
        })
    },
    CloseAttach() {
      this.dataList = []
      this.attachVisible = false
    },
    hanldClose() {
      this.$emit('update:visible', false)
    },
  },
}
</script>

<style scoped></style>
